.mgClassify {
  background-color: #fff;
  .mgClassifyHeader {
    width: 100%;
    background-color: #fff;
    height: 1.226667rem;
    position: fixed;
    top: 0;
    left: 0;
    padding: 0.186667rem 0.133333rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #ddd;
    .ClassifyHeaderLeft {
      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      flex: 1;
      i {
        font-size: 0.8rem;
        color: #adadad;
      }
    }
    .ClassifyHeaderCid {
      height: 100%;
      flex: 5;
      display: flex;
      align-items: center;
      background-color: #eeeeee;
      i {
        color: #c0c0c0;
        font-size: 0.426667rem;
        margin: 0 0.16rem 0 0.106667rem;
      }
      span {
        color: #9e9e9e;
      }
    }
    .ClassifyHeaderRight {
      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      flex: 1;
      i {
        font-size: 0.693333rem;
        color: #adadad;
      }
    }
  } // 主体内容
  .mgClassifyMain {
    display: flex;
    margin-top: 1.253333rem;
    .ClassifyMainLeftList {
      width: 2.666667rem;
      height: calc( 100vh - 1.253333rem);
      overflow-y: scroll;
      .MainLeftListItem {
        width: 2.666667rem;
        height: 1.2rem;
        background-color: #f6f6f6;
        display: flex;
        justify-content: center;
        align-items: center;
        p {
          width: 100%;
          height: 0.4rem;
          font-size: 0.373333rem;
          color: #666;
          line-height: 0.4rem;
          text-align: center;
        }
        .active {
          border-left: solid #FF5577 4px;
          font-weight: bold;
          color: #FF5577;
          background-color: #fff;
        }
      }
      .activePar {
        background-color: #fff;
      }
    }
    .ClassifyMainRight {
      width: calc(100vw - 2.666667rem);
      height: calc( 100vh - 1.226667rem);
      overflow-y: scroll;
      // position: relative;
      .showBox{
        width:7.333333rem;
        height: 1.146667rem;
        position: fixed;
        // display: none;
        top: 1.226667rem;
        left: 2.666667rem;
        background-color: #fff;
        z-index: 20;
        border-bottom: 0.026667rem solid #ddd;
      }
      .MainRightTop {
        width: 7.6rem;
        height: 10.08rem;
        padding:0 0.266667rem 0;
        display: flex;
        flex-wrap: wrap;
        .MainRightTopItem {
          width: 2.346667rem;
          height: 2.533333rem;
          margin: 0.266667rem 0;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          img {
            width: 1.733333rem;
            height: 1.733333rem;

          }
          span {
            font-size: 0.32rem;
            color: #666;
            margin-top: 0.266667rem;
          }
        }
      }
      .MainRightTabs {
        width: 100%;
        .synthesize {
          .MainRightBottom {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            width: 7.6rem;
            .ightBottomItem {
              width: 3.573333rem;
              height: 6.053333rem;
              margin: 0.133333rem 0.053333rem 0 0.053333rem;
              display: flex;
              flex-direction: column;
              justify-content: center;
              align-items: center;
              position: relative;
              img {
                width: 3.573333rem;
                height: 4.773333rem;
                border-radius: 0.133333rem;
              }
              .Num {
                position: absolute;
                left: 0.133333rem;
                bottom: 1.3333rem;
                display: block;
                width: 1.6rem;
                height: 0.666667rem;
                text-align: center;
                line-height: 0.666667rem;
                background-color: #ccc;
                color: #fff;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
              }
              p {
                width: 100%;
                overflow: hidden;
                text-overflow: ellipsis;
                margin-top: 0.133333rem;
                white-space: nowrap;
              }
              .BottomItemBottom {
                display: flex;
                width: 100%;
                justify-content: space-between;
                height: 0.64rem;
                align-items: center;
                .ItemBottomLeft {
                  margin-top: 0.08rem;
                  color: #FF5577;
                  font-size: 0.4rem;
                }
                .ItemBottomRight {
                  span {
                      color: #999;
                      font-size: 0.32rem;
                  }
                  i {
                    color: #eee;
                  }
                }
              }
            }
          }
        }
      }
    }
  }
}